<html>
    <head>
        <meta charset="utf-8">
        <title>requestAnimtionFrame</title>
        <style>
            #box{
                position: absolute;
                left: 0px;
                width: 100px;
                height: 100px;
                background-color: #FF0000;
            }
        </style>

        <script type="text/javascript">

            var dis = 0;

            function animation(){
                requestAnimationFrame(function(){
                    var pos = (++dis) + "px";
                    document.getElementById("box").style.left = pos;

                    if(dis>=500)
                    {
                        dis = 0;
                    }
                    animation();
                });  
            }

            function init(){
                animation();                
            }

        </script>
            
    </head>
    <body onload="init()">
        <div id="box"></div>
    </body>
</html>



